<template>
  <div class="all">
    <header>
      <div class="div">
        <img src="../../../assets/返回.png" @click="back()" alt="">
        <span class="solid" @click="back()" >上一步</span>
      </div>
      <div class="div">
        <span>{{typeTitle}}</span>
      </div>
      <div class="div">
        <span class="solid" @click="next()">下一步</span>
      </div>
    </header>
    <div class="menu">
      <el-steps :active="menuIndex" align-center>
        <el-step title=""
                 v-for="(item, index) in (type== 5 ? menuList5 : menuList)"
                 :key="index"
                 @click.native="changeMenu(index, url)"
                 process-status="success"
                 :description="item.title">
          <template #icon>
            <div v-if="menuIndex >= index" style="width: 15px;height: 15px;">
              <img src="../../../assets/步骤选择.png" style="width: 15px;height: 15px;" alt="">
            </div>
            <div v-else style="width: 6px;height: 15px;background: #1DA4F2;display: flex;align-items: center;justify-content: center">
              <a style="width: 6px;height: 6px;border-radius: 50%;background: white;display: flex;position: absolute;"></a>
            </div>
          </template>
        </el-step>
      </el-steps>
    </div>
    <div class="title" ><a class="hengGang"></a>请选择您要的{{typeLabel}}服务</div>
    <ul class="ulList" :class="[item.id == doc_amount_type ? 'select' : 'noSelect']"
        @click="clickPrice(item)"
        v-for="(item, index) in priceList" :key="index">
      <li>
        <span>{{item.item_id}}</span>
        <span>
          {{item.rebate_amount}}元/次
          <span v-show="type == 2 || type == 5">({{item.duration}}分钟)</span>
        </span>
      </li>
    </ul>
    <div  style="width: 100%;height: 50vh;display: flex;align-items: center;justify-content: center"
          v-show="jiageLoading">
      <van-loading size="24px" type="spinner" color="#1989fa">加载中...</van-loading>
    </div>
    <van-empty
      style="width: 100%;height: 60%"
      v-show="priceList.length <= 0 && jiageLoading === false"
      class="custom-image"
      :image="require('../../../assets/空两本书.png')"
      :description="`暂无` +typeLabel+`服务`"
    />

    <div class="title" style="justify-content: space-between;margin-top: 10px"
         v-show="(type == 2 || type == 5) && priceList.length > 0">
      <span style="display: flex;align-items: center"><a class="hengGang"></a>预约{{typeLabel}}时间</span>
      <span class="qiwangInput" style="color: #1da4f2;display: flex;align-items: center" @click="clickYuYueTime">
        <input type="text" readonly :placeholder="`请选择预约`+typeLabel+`时间`" v-model="DATE">
        <img style="width: 7px;height: 13px;" src="../../../assets/更多灰.png" alt="">
      </span>
    </div>
    <van-popup round v-model="qiWangShow" position="bottom" :style="{height: '80%', bottom: '50px'}">
      <div class="popDiv">
        <div class="popTop">
          <div class="popHeader">
            <div class="div">
              <span @click="qiWangCancel()">取消</span>
            </div>
            <div class="div">
              <span>选择预约{{typeLabel}}时间</span>
            </div>
            <div class="div" >
              <span class="solid" style="margin-right: 0!important;" @click="qiWangConfirm">确认</span>
            </div>
          </div>
          <div class="popSelect" v-if="sevenDayList && sevenDayList.length > 0">
            <div class="popDate" @click="getDayPaiban(item, 1)"
                 :class="weekDay === item.weekDay ? 'dateSelect' : ''"
                 v-for="(item, index) in sevenDayList" :key="index">
              <p>{{item.week}}</p>
              <p>{{item.date}}</p>
              <p :style="{color: item.schedule_con == '有号' ? '#F19149' : ''}">[{{item.schedule_con}}]</p>
            </div>
          </div>
        </div>
        <div class="popContent">
          <van-empty
            style="width: 100%;height: 60%"
            v-show="paibanList.length <= 0 && paiBanLoading === false"
            class="custom-image"
            :image="require('../../../assets/空两本书.png')"
            description="暂无号源"
          />
          <div  style="width: 100%;height: 50vh;display: flex;align-items: center;justify-content: center" v-show="paiBanLoading">
            <van-loading size="24px" type="spinner" color="#1989fa">加载中...</van-loading>
          </div>
          <p v-for="(item, index) in paibanList" :key="index"
             :class="[item.disable ? 'disable' : '']"
             @click.stop="selectPaiban(item, index)">
            <span>
              <a >
                {{item.start_time}} ~ {{item.end_time}} {{ item.disable ? '[已约满]' : '' }}
              </a>
            </span>
            <img v-show="item.checked === true" style="width: 12px;height: 9px;" src="../../../assets/selectImg/确定@2x.png" alt="">
          </p>
        </div>
      </div>
    </van-popup>
    <van-popup position="bottom" round :style="{height: '80%', bottom: '50px', background: '#FAF9FE'}" v-model="team_doctorShow">
      <div class="popDiv">
        <div class="popHeader" style="border-bottom: 1px solid #e5e5e5">
          <div class="div">
            <span @click="team_doctorShow = false">取消</span>
          </div>
          <div class="div">
            <span>选择医生</span>
          </div>
          <div class="div" >
            <span class="solid" style="margin-right: 0!important;" @click="selectDocNext">下一步</span>
          </div>
        </div>
        <div class="box"
             @click="clickBox(item)"
             :class="team_doc_id == item.USER_ID ? 'selectDoctor' : ''"
             v-for="(item, index) in team_doc_list" :key="index">
          <div class="box_left">
            <img v-if="item.PHOTO" :src="item.PHOTO" class="PHOTO" alt="">
            <img v-else src="../../../assets/男医生@2x.png" class="PHOTO" alt="">
          </div>
          <div class="box_right">
            <ul>
              <li>
                <span class="name" style="font-weight: bold;font-size: 15px">{{item.NICK_NAME}}</span>
                <span v-if="item.schedulelist && item.schedulelist.length > 0"
                style="color: rgb(241, 145, 73);"
                >有号源</span>
                <span v-else>无号源</span>
              </li>
              <li>
                <span style="font-weight: 500;font-size: 13px !important;">{{item.MAJOR}}</span>
                <span>|</span>
                <span style="font-weight: 500;font-size: 13px !important;">{{item.DEPART}}</span>
              </li>
              <li>
                <span class="jieShao">{{item.HOSPITAL_NAME}}</span>
                <button class="biaoqian" v-if="item.GRADE">{{item.GRADE}}</button>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </van-popup>
<!--    <p class="tishi">小提示：选择您要咨询的项目到下一步描述病情</p>-->
  </div>
</template>

<script>
import {Toast} from 'vant'
export default {
  name: 'TuWenPrice',
  data () {
    return {
      priceList: [],
      doc_user_id: '',
      amount: '',
      doc_amount_type: '', // 订单价格 对应id
      type: Number(this.$route.query.type),
      doc_amount_name: '', //       项目名称
      doc_amount_duration: '', //       时长(分钟)
      menuIndex: 1,
      menuList: [
        {
          title: '选择医生/团队',
          url: '/first'
        },
        {
          title: '预约信息',
          url: '/tuWenPrice'
        },
        {
          title: '咨询准备',
          url: '/second'
        },
        {
          title: '费用支付',
          url: '/third'
        }
      ],
      menuList5: [
        {
          title: '选择医生/团队',
          url: '/first'
        },
        {
          title: '预约信息',
          url: '/tuWenPrice'
        },
        {
          title: '会诊准备',
          url: '/second'
        },
        {
          title: '费用支付',
          url: '/third'
        }
      ],
      qiWangShow: false,
      weekDay: '',
      paibanList: [],
      schedule_id: '',
      book_date: '',
      book_time_start: '',
      book_time_end: '',
      DATE: '',
      jiageLoading: true, // 价格加载
      paiBanLoading: true, // 排班加载
      sevenDayList: [],
      selectList: [],
      team_id: this.$route.query.team_id,
      isHave7paiban: true, // 判断当前项目最近7天是否有号源
      team_doctorShow: false,
      team_doc_id: '',
      team_doc_list: []
    }
  },
  computed: {
    typeLabel: function () {
      if (this.type !== 5) {
        return '咨询'
      } else {
        return '会诊'
      }
    },
    typeTitle: function () {
      if (this.type === 1) {
        document.title = '图文咨询'
        return '图文咨询'
      } else if (this.type === 2) {
        document.title = '视频咨询'
        return '视频咨询'
      } else if (this.type === 5) {
        document.title = '远程会诊'
        return '远程会诊'
      }
    }
    // sevenDayList: function () {
    //   let arr = []
    //   let Date0 = new Date()
    //   for (var i = 1; i < 8; i++) {
    //     let weekNum = new Date(Date0.getTime() + i * 24 * 60 * 60 * 1000).getDay()
    //     if (Number(weekNum) === 0) {
    //       weekNum = 7
    //     }
    //     let obj = {
    //       week: this.fun_week(new Date(Date0.getTime() + i * 24 * 60 * 60 * 1000)),
    //       date: this.formatDate(new Date(Date0.getTime() + i * 24 * 60 * 60 * 1000)),
    //       weekDay: weekNum,
    //       sendate: this.formatYear(new Date(Date0.getTime() + i * 24 * 60 * 60 * 1000))
    //     }
    //     // 这里是将来的七天，如果是过去的七天将加号转换为减号就好
    //     arr.push(obj)
    //   }
    //   return arr
    // }

  },
  mounted () {
    if (JSON.parse(sessionStorage.getItem('DATA')) !== null) {
      var data = JSON.parse(sessionStorage.getItem('DATA'))
      this.doc_amount_type = data.doc_amount_type
      this.amount = data.amount
      this.doc_user_id = data.doc_user_id
      this.book_date = data.book_date
      this.doc_amount_duration = data.doc_amount_duration
      this.book_time_start = data.book_time_start
      this.book_time_end = data.book_time_end
      this.schedule_id = data.schedule_id // 排班id
      this.doc_amount_name = data.doc_amount_name
      this.selectList = data.selectList
      if (data.schedule_id !== '' && data.schedule_id !== undefined && data.schedule_id !== null) {
        this.DATE = data.book_date + ' ' + data.book_time_start + '-' + data.book_time_end
      }
    }
    if (this.team_id) {
      this.getTeamService()
    } else {
      this.getPrice()
    }
  },
  methods: {
    // 选中团队医生下一步
    selectDocNext () {
      if (this.team_doc_id) {
        this.getSeven()
        this.team_doctorShow = false
        this.qiWangShow = true
      } else {
        this.$toast('请先选择医生')
      }
    },
    // 点击选择团队医生
    clickBox (item) {
      if (item.schedulelist && item.schedulelist.length <= 0) {
        this.$toast('该医生近七天无可预约号源')
        return false
      }
      this.team_doc_id = item.USER_ID
    },
    // 获取团队下有排班医生
    getTeamDoctorList () {
      this.$http.findDoctor({
        team_id: this.team_id,
        team_amount_id: this.doc_amount_type
      })
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            this.team_doc_list = res.data.data
          } else {
            this.$toast(res.data.msg)
          }
        })
        .catch(err => {
          console.log(err)
          this.$toast('您的网络有些拥挤，请稍后再试')
        })
    },
    // 点击预约时间
    clickYuYueTime () {
      if (this.isHave7paiban === true) {
        if (this.team_id && (this.type == 2 || this.type == 5)) {
          this.getTeamDoctorList()
          this.team_doctorShow = true
        } else {
          this.qiWangShow = true
        }
      } else {
        this.$toast('近七天无可预约号源')
        return false
      }
    },
    unique (arr) {
      const res = new Map()
      return arr.filter((arr) => !res.has(arr.start_time) && res.set(arr.start_time, 1))
    },
    // 获取未来7天日期和排班情况
    getSeven () {
      this.sevenDayList = []
      let doc_user_id = ''
      if (this.doc_user_id) {
        doc_user_id = this.doc_user_id
      } else {
        doc_user_id = this.team_doc_id
      }

      let team_id = ''
      if (this.team_id) {
        team_id = this.team_id.toString()
      } else {
        team_id = '-1'
      }
      let doc_amount_id = ''
      let team_amount_id = ''
      if (this.team_id) {
        team_amount_id = this.doc_amount_type
      } else {
        doc_amount_id = this.doc_amount_type
      }
      if (this.doc_amount_type) {}
      this.$http.find7DaySchedule({
        team_id: team_id,
        doc_user_id: doc_user_id,
        del_tag: '0,0',
        doc_amount_id: doc_amount_id,
        team_amount_id: team_amount_id
      })
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            let data = res.data.data
            data.forEach((curr, index) => {
              let obj = {
                dateday: curr.dateday,
                date: this.formatDate(curr.dateday),
                week: this.Common.week(curr.dateday),
                weekDay: curr.weekly,
                list: curr.schedulelist,
                schedule_con: curr.schedule_con
              }
              if (curr.schedulelist.length > 0) {
                obj.youwu = 1
              } else {
                obj.youwu = 2
              }
              this.sevenDayList.push(obj)
            })
            this.weekDay = this.sevenDayList[0].weekDay
            this.getDayPaiban(this.sevenDayList[0], 0)
          } else {
            this.$toast(res.data.msg)
          }
        })
        .catch(err => {
          console.log(err)
          this.$toast('您的网络有些拥挤，请稍后再试')
        })
    },
    // 选择排班
    selectPaiban (item, index) {
      this.schedule_id = ''
      this.paibanList.map((odd, index) => {
        this.$set(odd, 'checked', false)
      })
      if (item.disable === true) {
        Toast('该时间段排班已满')
      } else {
        // 可选时间的次数
        var frequency = this.doc_amount_duration / 15
        if (frequency <= 1) {
          item.checked = !item.checked
        } else {
          var isnext = true
          for (var ii = 0; ii < frequency; ii++) {
            // 判断如果后面的值等于 undefiend 或者 disable=true 就说明后面不能选择
            // if (this.paibanList[index + ii] === undefined ||
            //   (this.paibanList[index + ii] && this.paibanList[index + ii].disable === true) ||
            //   index + ii > this.paibanList.length) {
            //   isnext = false
            //   break
            // } else if (this.paibanList[index + ii]) {
            //   this.paibanList[index + ii].checked = true
            // }
            // if (this.paibanList[index + ii] && this.paibanList[index + ii].disable !== true) {
            //   this.paibanList[index + ii].checked = true
            // } else {
            //   this.paibanList.map((odd, index) => {
            //     this.$set(odd, 'checked', false)
            //   })
            //   isnext = false
            //   break
            // }
            if (this.paibanList[index + ii]) {
              this.schedule_id += this.paibanList[index + ii].pid + ','
              if (index == index + ii) {
                this.paibanList[index + ii].checked = true
              } else if (ii > 0 && (this.paibanList[index + ii - 1].end_time == this.paibanList[index + ii].start_time) && this.paibanList[index + ii].disable !== true) {
                this.paibanList[index + ii].checked = true
              } else {
                this.paibanList.map((odd, index) => {
                  this.$set(odd, 'checked', false)
                })
                isnext = false
                break
              }
            } else {
              this.paibanList.map((odd, index) => {
                this.$set(odd, 'checked', false)
              })
              isnext = false
              break
            }
          }
          // 如果可以往后选
          if (isnext) {

          } else {
            var ispre = true
            // 往前选择 如果前面也有等于undefiend 或者disable 清除所有的选中项
            for (var ii = 0; ii < frequency; ii++) {
              // if ((this.paibanList[index - ii] && this.paibanList[index - ii].disable === true) || index < 0) {
              //   this.paibanList.map((odd, index) => {
              //     odd.checked = false
              //   })
              //   ispre = false
              //   break
              // } else if (this.paibanList[index - ii]) {
              //   this.paibanList[index - ii].checked = true
              // }
              // if (this.paibanList[index - ii] && this.paibanList[index - ii].disable !== true) {
              //   this.paibanList[index - ii].checked = true
              // } else {
              //   this.paibanList.map((odd, index) => {
              //     this.$set(odd, 'checked', false)
              //   })
              //   ispre = false
              //   break
              // }
              if (this.paibanList[index - ii]) {
                this.schedule_id += this.paibanList[index - ii].pid + ','
                if (index == index - ii) {
                  this.paibanList[index - ii].checked = true
                } else if (ii > 0 && (this.paibanList[index - ii + 1].start_time == this.paibanList[index - ii].end_time) && this.paibanList[index - ii].disable !== true) {
                  this.paibanList[index - ii].checked = true
                } else {
                  this.paibanList.map((odd, index) => {
                    this.$set(odd, 'checked', false)
                  })
                  ispre = false
                  break
                }
              } else {
                this.paibanList.map((odd, index) => {
                  this.$set(odd, 'checked', false)
                })
                ispre = false
                break
              }
            }
            if (ispre) {

            } else {
              this.schedule_id = ''
              Toast('该时间段排班已满')
              return false
            }
          }
        }
        this.schedule_id = this.schedule_id.substring(0, this.schedule_id.length - 1)
        if (item.checked === true) {
          this.selectList = []
          this.paibanList.map((odd, index) => {
            if (odd.checked === true) {
              this.selectList.push(odd)
            }
          })
          this.book_time_start = this.selectList[0].start_time
          this.book_time_end = this.selectList[this.selectList.length - 1].end_time
        }
      }
    },
    // 排班取消按钮
    qiWangCancel () {
      this.qiWangShow = false
      var data = JSON.parse(sessionStorage.getItem('DATA'))
      if (data.schedule_id) {
        this.book_date = data.book_date
        this.book_time_start = data.book_time_start
        this.book_time_end = data.book_time_end
        this.schedule_id = data.schedule_id
      } else {
        this.book_date = ''
        this.book_time_start = ''
        this.book_time_end = ''
        this.schedule_id = ''
      }
      if (this.book_date && this.book_time_start) {
        this.DATE = this.book_date + ' ' + this.book_time_start + '-' + this.book_time_end
      } else {
        this.DATE = ''
      }
      // sessionStorage.setItem('DATA', JSON.stringify(data))
    },
    // 排班确认
    qiWangConfirm () {
      var data = JSON.parse(sessionStorage.getItem('DATA'))
      data.book_date = this.book_date
      data.book_time_start = this.book_time_start
      data.book_time_end = this.book_time_end
      data.schedule_id = this.schedule_id // 排班id
      if (!data.schedule_id) {
        Toast('请选择预约' + this.typeLabel + '时间')
        return false
      }
      // 选择的排班时间段
      data.selectList = this.selectList

      this.DATE = data.book_date + ' ' + data.book_time_start + '-' + data.book_time_end
      sessionStorage.setItem('DATA', JSON.stringify(data))
      this.qiWangShow = false
    },
    // 获取排班
    getDayPaiban (item, num) {
      this.paibanList = []
      let container = []
      let occupy = []

      this.paiBanLoading = true
      this.weekDay = item.weekDay
      this.book_date = item.dateday

      let doc_user_id = ''
      if (this.doc_user_id) {
        doc_user_id = this.doc_user_id
      } else {
        doc_user_id = this.team_doc_id
      }

      let team_id = ''
      let team_amount_id = ''
      let doc_amount_id = ''
      if (this.team_id) {
        team_id = this.team_id.toString()
        team_amount_id = this.doc_amount_type
      } else {
        team_id = '-1'
        doc_amount_id = this.doc_amount_type
      }

      this.$http.findDocScheduleParam({
        team_id: team_id,
        dateday: item.dateday,
        team_amount_id: team_amount_id,
        doc_amount_id: doc_amount_id,
        doc_user_id: this.doc_user_id,
        del_tag: '0,0'
      })
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            let data = res.data.data
            data.forEach((curr, index) => {
              if (curr.inquiry_id) {
                let obj = {
                  start_time: curr.start_time,
                  end_time: curr.end_time,
                  pid: curr.id,
                  disable: true
                }
                container.push(obj)
              } else {
                let obj = {
                  start_time: curr.start_time,
                  end_time: curr.end_time,
                  pid: curr.id
                }
                container.push(obj)
              }
            })
            container = this.unique(container)
            this.paibanList = container
            this.paiBanLoading = false
          } else {
            this.$toast(res.data.msg)
          }
        })
        .catch(err => {
          console.log(err)
          this.$toast('您的网络有些拥挤，请稍后再试')
        })
    },
    getDateArray (startTime, endTime, pid) {
      let start = new Date(startTime)
      let end = new Date(endTime)
      let startDate = start.getTime()
      let endDate = end.getTime()
      const space = 30 * 60 * 1000 // 30分钟转换成毫秒
      let mod = endDate - startDate //
      let dateArry = []
      while (mod >= space) {
        let obj = {
          pid: pid,
          start_time: new Date(startDate).getHours().toString().padStart(2, 0) + ':' +
            new Date(startDate).getUTCMinutes().toString().padStart(2, 0),
          end_time: new Date(startDate + space).getHours().toString().padStart(2, 0) + ':' +
            new Date(startDate + space).getUTCMinutes().toString().padStart(2, 0)
        }
        dateArry.push(obj)
        // dateArry.push(
        //   new Date(startDate).getHours().toString().padStart(2, 0) + ':' +
        //   new Date(startDate).getUTCMinutes().toString().padStart(2, 0) +
        //   '~' +
        //   new Date(startDate + space).getHours().toString().padStart(2, 0) + ':' +
        //   new Date(startDate + space).getUTCMinutes().toString().padStart(2, 0))
        mod = mod - space
        startDate = startDate + space
      }
      return dateArry
    },
    // 转换月日
    formatDate (date) {
      var date = new Date(date)
      var YY = date.getFullYear() + '-'
      var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
      var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate())
      var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
      var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':'
      var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())
      return MM + DD
    },
    // 转换年月日
    formatYear (date) {
      var date = new Date(date)
      var YY = date.getFullYear() + '-'
      var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
      var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate())
      var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
      var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':'
      var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())
      return YY + MM + DD
    },
    // 转换周几
    fun_week (datestr) {
      var weekArray = new Array('周日', '周一', '周二', '周三', '周四', '周五', '周六')
      var week = weekArray[new Date(datestr).getDay()]
      return week
    },
    // 点击步骤条
    changeMenu (index) {},
    // 返回
    back () {
      this.$router.history.go(-1)
    },
    // 点击价格
    clickPrice (item) {
      if (item.schedulelist.length > 0) {
      } else {
        this.isHave7paiban = false
      }

      this.amount = item.rebate_amount
      this.doc_amount_type = item.id
      this.doc_amount_name = item.item_id // '项目名称'
      this.doc_amount_duration = item.duration // '时长(分钟)'

      this.schedule_id = ''
      this.book_time_start = ''
      this.book_time_end = ''
      this.DATE = ''

      var data = JSON.parse(sessionStorage.getItem('DATA'))
      data.book_date = ''
      data.book_time_start = ''
      data.book_time_end = ''
      data.schedule_id = '' // 排班id
      data.doc_amount_name = item.item_id
      sessionStorage.setItem('DATA', JSON.stringify(data))
      this.getSeven()
      this.selectList = []
    },
    // 下一步
    next () {
      if (this.amount == '') {
        Toast('请选择价格')
        return false
      } else {
        var data = JSON.parse(sessionStorage.getItem('DATA'))
        data.amount = this.amount // 价格
        data.doc_amount_type = this.doc_amount_type //
        data.doc_amount_name = this.doc_amount_name
        if (this.type == 2 || this.type == 5) {
          data.doc_amount_duration = this.doc_amount_duration
          if (data.schedule_id == '' || data.schedule_id == undefined) {
            Toast('请选择预约' + this.typeLabel + '时间')
            return false
          }
        }
        sessionStorage.setItem('DATA', JSON.stringify(data))
        let path
        if (this.type == 5) {
          path = this.menuList5[this.menuIndex + 1].url
        } else {
          path = this.menuList[this.menuIndex + 1].url
        }
        this.$router.push({path: path, query: {'type': this.type}})
      }
    },
    // 获取团队服务项目
    getTeamService () {
      this.$http.findTeamPrice({
        item_type: this.type,
        team_id: this.team_id,
        is_show_schedule: 1
      })
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            this.priceList = res.data.data
            if (this.doc_amount_type) {

            } else if (this.priceList.length > 0) {
              this.doc_amount_type = res.data.data[0].id
              this.amount = res.data.data[0].amount
              this.doc_amount_duration = res.data.data[0].duration
              this.doc_amount_name = res.data.data[0].item_id

              if (res.data.data[0].schedulelist && res.data.data[0].schedulelist.length > 0) {
                this.isHave7paiban = true
              } else {
                this.isHave7paiban = false
              }
            }
            // if ((this.type == 2 || this.type == 5) && this.priceList.length > 0) {
            //   this.getSeven()
            // }
            this.jiageLoading = false
          } else {
            this.$toast(res.data.msg)
          }
        })
        .catch(err => {
          console.log(err)
          this.$toast('您的网络有些拥挤，请稍后再试')
        })
    },
    // 获取个人服务项目
    getPrice () {
      this.jiageLoading = true
      this.$http.findDocAmount({item_type: this.type,
        USER_ID: this.doc_user_id,
        is_show_schedule: 1})
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            this.priceList = res.data.data
            if (this.doc_amount_type) {

            } else if (this.priceList.length > 0) {
              this.doc_amount_type = res.data.data[0].id
              this.amount = res.data.data[0].amount
              this.doc_amount_duration = res.data.data[0].duration
              this.doc_amount_name = res.data.data[0].item_id

              if (res.data.data[0].schedulelist && res.data.data[0].schedulelist.length > 0) {
                this.isHave7paiban = true
              } else {
                this.isHave7paiban = false
              }
            }
            if ((this.type == 2 || this.type == 5) && this.priceList.length > 0) {
              this.getSeven()
            }
            this.jiageLoading = false
          } else {
            this.$toast(res.data.msg)
          }
        })
        .catch(err => {
          console.log(err)
          this.$toast('您的网络有些拥挤，请稍后再试')
        })
      // this.$http.findDoctorMoney({'doc_user_id': this.doc_user_id, item_type: this.type})
      //   .then(res => {
      //     console.log(res)
      //     if (res.data.status === 'success') {
      //       this.priceList = res.data.data
      //       if (this.doc_amount_type !== '' && this.doc_amount_type !== null && this.doc_amount_type !== undefined) {
      //
      //       } else if (this.priceList.length > 0) {
      //         this.doc_amount_type = res.data.data[0].id
      //         this.amount = res.data.data[0].amount
      //         this.doc_amount_duration = res.data.data[0].duration
      //         this.doc_amount_name = res.data.data[0].item_id
      //       }
      //       if ((this.type == 2 || this.type == 5) && this.priceList.length > 0) {
      //         this.getSeven()
      //       }
      //       this.jiageLoading = false
      //     }
      //   })
      //   .catch(err => {
      //     console.log(err)
      //   })
    }
  }
}
</script>

<style scoped>
  .all{
    width: 100%;
    height: 100%;
    overflow: auto;
    background: #FAF9FE;
  }
  header{
    width: 100%;
    height: 44px;
    display: flex;
    align-items: center;
    font-family: "PingFang SC";
    background: white;
    position: sticky;
    top: 0;
    border-bottom: 1px solid #E5E5E5;
  }
  .div{
    font-size: 15px;
    font-weight: bold;
    display: flex;
    align-items: center;
  }
  .div:nth-child(1){
    width: 30%;
  }
  .div:nth-child(1) img{
    width: 7px;
    height: 13px;
    margin: 0 5px 0 15px;
  }
  .div:nth-child(2){
    width: 40%;
    justify-content: center;
  }
  .div:nth-child(3){
    width: 30%;
    justify-content: flex-end;
  }
  .div:nth-child(3) span{
    margin-right: 15px;
  }
  .solid{
    color: #1DA4F2;
  }
  .ulList{
    width: 100%;
    height: 44px;
  }
  .ulList li{
    width: 95%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /*padding: 0 15px;*/
    box-sizing: border-box;
    font-size: 15px;
    font-family: PingFang SC;
    font-weight: 500;
    border-bottom: 1px solid #E5E5E5;
    margin: 0 auto;
  }
  .noSelect{
    background: white;
    color: #333333;
  }
  .select{
    color: #fff !important;
    background: #1DA4F2 !important;
  }
  .title{
    width: 100%;
    height: 44px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    box-sizing: border-box;
    font-size: 15px;
    font-family: PingFang SC;
    font-weight: bold;
    background: white;
  }
  .hengGang{
    display: block;
    width: 2px;
    border-radius: 1px;
    height: 15px;
    background: #1DA4F2;
    margin-right: 5px;
  }
  .tishi{
    height: 44px;
    display: flex;
    align-items: center;
    font-size: 11px;
    font-family: PingFang SC;
    font-weight: 500;
    color: #333333;
    padding: 0 10px;
    box-sizing: border-box;
  }

  .menu{
    width: 100%;
    height: 60px;
    background: #1DA4F2;
    box-shadow: 0px 1px 0px 0px #E5E5E5;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow:hidden;
    position: sticky;
    top: 44px;
    z-index: 999;
  }
  /deep/ .right-content li{
    height: 47px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 8px;
    box-sizing: border-box;
  }
  /deep/ .van-sidebar-item--select::before{
    position: absolute;
    top: 50%;
    left: 0;
    width: 4px;
    height: 16px;
    background-color: #1DA4F2;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
  }
  /*/ 选择框 开始样式/*/
  /deep/ .el-steps--horizontal{
    width: 105%;
  }
  /deep/ .el-step.is-center .el-step__description{
    padding: 0;
    font-size: 13px;
  }
  /deep/ .el-step__description{
    margin: 0;
  }
  /deep/ .el-step__icon{
    width: auto;
    height: auto;
  }
  /deep/ .el-step__icon.is-text{
    border: none;
  }
  /deep/ .is-finish,
  /deep/ .el-step__description.is-process{
    color: #fff;
  }
  /deep/ .el-step__description.is-finish{
    color: white !important;
  }
  /deep/ .el-step__description.is-wait{
    color: rgba(255, 255, 255, 0.7);
  }
  /deep/ .el-step__head.is-finish{
    border-color: #fff;
  }
  /deep/ .el-step__head.is-wait{
    border-color: transparent !important;
  }
  /deep/ .el-step__line{
    border-color: transparent !important;
  }
  /deep/ .el-step.is-horizontal .el-step__line{
    height: 1px;
    /*top:7px;*/
    top: 35%;
  }
  /deep/ .el-step__line{
    background: white;
  }
  /*/ 选择框 结束样式/*/
  .popDiv{
    width: 100%;
  }
  .popTop{
    position: sticky;
    top: 0;
    z-index: 999;
    background: #FFFFFF;
  }
  .popHeader{
    height: 60px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    box-sizing: border-box;
  }
  .popSelect{
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    font-size: 15px;
    font-weight: bold;
    font-family: "PingFang SC";
    overflow-y: hidden;
    flex-wrap: nowrap;
    white-space: nowrap;
    background: #1da4f2 !important;
  }
  .popDate{
    min-width: 55px;
    height: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    background: #1da4f2 !important;
    color: #fff !important;
    font-family: "PingFang SC";
    font-weight: 500!important;
    font-size: 13px !important;

  }
  .dateSelect{
    height: 90% !important;
    color: #1da4f2 !important;
    background: #E3F0FD !important;
    border-radius: 10px;
  }
  .popContent{
    width: 100%;
    padding: 0 5px;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .popContent p{
    width: 49%;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 8px;
    box-sizing: border-box;
    box-shadow: 0px 5px 15px 0px rgba(29, 164, 242, 0.15);
    border-radius: 5px;
    margin-top: 10px;
    font-size: 15px;
  }
  /*.popContent p span{*/
  /*  margin-left: 8px;*/
  /*}*/
  .qiwangInput{
    display: flex;
    align-items: center;
  }
  .qiwangInput input{
    width: 200px;
    text-align: right;
    border: none;
    margin-right: 5px;
    font-weight: 500;
  }
  /*.qiwangInput input::placeholder{*/
  /*  color: #1da4f2;*/
  /*}*/
  .paibanSelect{
    color: #1da4f2 !important;
    font-size: 17px !important;
  }
  .disable{
    color: #C2C2C2;
  }
  .box{
    padding: 10px;
    box-sizing: border-box;
    background: white;
    margin-bottom: 8px;
    display: flex;
  }
  .all .box:last-of-type{
    margin-bottom: 60px;
  }
  .PHOTO{
    width: 55px;
    height: 55px;
    border-radius: 50%;
    object-fit: cover;
  }
  .box_left{
    width: 23%;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-between;
  }
  .dict_name{
    font-size: 11px;
    border: 1px solid #1DA4F2;
    border-radius: 2px;
    background: rgba(16, 184, 246, 0.1);
    color: #1da4f2;
    padding: 1px 3px;
    box-sizing: border-box;
    white-space: nowrap;
    /*margin-top: 10px;*/
  }
  .box_right{
    width: 78%;
  }
  .box_right ul{
    /*height: 60px;*/
    display: flex;
    flex-direction: column;
    align-content: space-around;
    justify-content: space-around;
  }
  .box_right ul li{
    display: flex;
    align-items: center;
    font-size: 13px;
    font-family: PingFang SC;
    min-height: 25px;
  }
  .box_right ul li:nth-child(1){
    justify-content: space-between;
  }
  .name{
    font-size: 15px!important;
    font-weight: bold;
    color: #333333;
  }
  .biaoqian{
    /*padding: 0px 8px;*/
    min-width: 44px;
    height: 18px;
    border-radius: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    /* background: rgba(29, 164, 242, 0.1); */
    background: transparent;
    color: #1DA4F2;
    /* border: none; */
    border: 1px solid;
    font-size: 11px;
    margin-left: 8px;
  }
  .biaoqian,
  .jieShao
  {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .jieShao{
    font-size: 13px;
    font-family: PingFang SC;
    font-weight: 500;
    color: #333333;
    margin-right: 8px;
  }
  .box_rigth_bottom p{
    margin-bottom: 5px;
  }
  .box_rigth_bottom p:nth-child(1),
  .box_rigth_bottom p:nth-child(3){
    font-size: 13px;
  }
  .box_rigth_bottom p a{
  }
  .box_rigth_bottom p span{
    color: #E3170D;
    margin: 0 8px 0 3px;
  }
  .popHeader{
    position: sticky;
    top: 0;
    background: #fff;
  }
 .selectDoctor{
    background: rgba(29, 164, 242, 0.1) !important;
  }
</style>
